<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
    <%
        String bathPath = request.getContextPath();
        pageContext.setAttribute("bathPath", bathPath);
    %>
    <meta charset="utf-8">
    <title>集体迟到/集体早退</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${bathPath}/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${bathPath}/css/common.css">
    <link rel="stylesheet" href="${bathPath}/css/group.css">
</head>
<body>
<section class="group-late">
    <div class="layui-form demoTable">
        <div class="layui-inline">
            <label class="layui-form-label">部门</label>
            <div class="layui-input-inline">
                    <select type="text" id="depId" name="depId" lay-verify="required" lay-filter="business"
                            autocomplete="off" class="layui-input">
                    </select>
            </div>
        </div>
        <div class="layui-inline" style="margin-left: 20px;">
            <button class="layui-btn layui-btn-normal w92" data-type="reload">查询</button>
            <button class="layui-btn layui-btn-normal" data-type="getCheckData" data-num="0">集体迟到</button>
            <button class="layui-btn layui-btn-normal" data-type="getCheckData" data-num="1" style="margin-left:15px !important;">集体早退</button>
        </div>
    </div>

<%--    <div class="layui-btn-group ml-54 demoTable">--%>

<%--    </div>--%>

    <table class="layui-hide" id="goupLate" lay-filter="test"></table>
</section>

<script src="${bathPath}/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="${bathPath}/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="${bathPath}/js/common.js"></script>
<script>

    var layerIndex = null;

    $(function () {
        initLayUI();
        $.ajax({
            type: "POST",
            async: false,
            data: "",
            url: "${bathPath}/dept/selectDpetName.action",
            success: function (msg) {
                var html = "";
                html += "<option value=''>" + '请选择' + "</option>";
                for (var i = 0; i < msg.length; i++) {
                    html += "<option value='" + msg[i].depID + "'>" + msg[i].depName + "</option>";
                }
                $("#depId").html(html);
            }
        });
    })

    function initLayUI(){
        layui.use(['form', 'table','laydate','layer'], function () {
            var form = layui.form;
            var table = layui.table;
            var laydate = layui.laydate;
            var layer = layui.layer;



            table.render({
                elem: '#goupLate'
                , url: '${bathPath}/userInfo/selectAll.action'
                , toolbar: true
                ,height: 'full-38'
                , title: '用户数据表'
                , cols: [[
                    {type: 'checkbox'}
                    , {
                        field: 'depName', title: '部门'
                    }
                    , {field: 'userID', title: '编号', sort: true}
                    , {field: 'userName', title: '姓名'}
                ]]
                , page: true
                , response: {
                    statusCode: 0 //重新规定成功的状态码为 200，table 组件默认为 0
                }
                , id: 'testReload'
                // , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                //     return {
                //         "code": res.status, //解析接口状态
                //         "msg": res.message, //解析提示文本
                //         "count": res.total, //解析数据长度
                //         "data": res.rows.item //解析数据列表
                //     };
                // }
            });

            var $ = layui.$, active = {
                // type 0  迟到  1  早退
                getCheckData: function(){ //获取选中数据
                    localStorage.removeItem('userId');
                    var num = $(this).data('num');

                    var checkStatus = table.checkStatus('testReload')
                        ,data = checkStatus.data;
                    console.log(data);
                    if(data.length === 0){
                        layer.msg('至少也得选一个吧',{icon:2});
                        return;
                    }
                    var ids = '';
                    for(var i = 0; i < data.length;i++){
                        ids += data[i].userID + ',';
                    }
                    console.log(ids);
                    localStorage.setItem('userId',ids);
                    runEvent(num);
                },
                reload: function () {
                    var depId = $('#depId');
                    //执行重载
                    table.reload('testReload', {
                        where: {
                            DepID: depId.val(),
                        }
                        ,page: {
                            curr: 1
                        }
                    });
                }
            };

            $('.demoTable .layui-btn').unbind("click").on('click', function(){
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });



            $(document).on('click','.cancel-layer',function(){
                layer.close(layer.index);
            })


            form.on('submit(formTest)',function(data){

                // layer.alert(JSON.stringify((data.field),{
                //     title:'最终提交的信息'
                // }))
                var userId = localStorage.getItem('userId');
                var num = $('#confirm').data('num');
                var dataJson = data.field;
                dataJson.checkType = num;
                dataJson.ids = userId;
                if(num === 0){
                    dataJson.yuanYin = "集体迟到";
                    $.ajax({
                        type: 'POST',
                        data: dataJson,
                        contentType:"application/x-www-form-urlencoded",
                        url: '${bathPath}/checkExact/insert.action',
                        success: function (data) {
                            if (data == 'SUCCESS') {
                                layer.close(layerIndex);
                                active.reload();
                            }
                        }
                    })
                }else if(num === 1){
                    dataJson.yuanYin = "集体早退";
                    $.ajax({
                        type: 'POST',
                        data: dataJson,
                        contentType:"application/x-www-form-urlencoded",
                        url: '${bathPath}/checkExact/insert.action',
                        success: function (data) {
                            if (data == 'SUCCESS') {
                                layer.close(layerIndex);
                                active.reload();
                            }
                        }
                    })
                }
                return false;
            })

            var runEvent = function(){
                //初始化表单值
                    form.val('example',{
                        'startTime':'',
                        'endTime':'',
                        'holidayType':'',
                        'reason':''
                    })
                var title;
                var obj = {};
                if(arguments && arguments[0] === 0){
                        title = '迟到设置';
                        obj.beginTimeLabel = '忽略签到开始时间';
                        obj.endTimeLabel = '忽略签到结束时间';
                        obj.checkTimeLabel = '修改后签到时间';
                }else if(arguments && arguments[0] === 1){
                        title = '早退设置';
                        obj.beginTimeLabel = '忽略签退开始时间';
                        obj.endTimeLabel = '忽略签退结束时间';
                        obj.checkTimeLabel = '修改后签退时间';
                }
                var num = arguments[0];
                // 弹出层
                var html =  '<div  id="addMask">'
                    +'<form class="layui-form setting-group-time" action="#" id=runForm" lay-filter="example">'
                    +'<div class="layui-form-item">'
                    +'<label class="layui-form-label">'+ obj.beginTimeLabel +'</label>'
                    +'<div class="layui-input-inline">'
                    +'<input type="text" class="layui-input" name="startTime" id="startTime" lay-verify="required" placeholder="请选择开始日期">'
                    +'</div>'
                    +'</div>'
                    +'<div class="layui-form-item">'
                    +'<label class="layui-form-label">'+ obj.endTimeLabel +'</label>'
                    +'<div class="layui-input-inline">'
                    +'<input type="text" name="endTime" class="layui-input" id="endTime" lay-verify="required" placeholder="请选择结束日期">'
                    +'</div>'
                    +'</div>'


                    +'<div class="layui-form-item">'
                    +'<label class="layui-form-label">'+ obj.checkTimeLabel +'</label>'
                    +'<div class="layui-input-inline">'
                    +'<input type="text" name="checkTime" class="layui-input" id="checkTime" lay-verify="required" placeholder="请选择修改后日期">'
                    +'</div>'
                    +'</div>'

                    +'<div class="layui-form-item">'
                    +'<div class="layui-input-block">'
                    +'<button lay-submit class="layui-btn layui-btn-normal" lay-filter="formTest" id="confirm">确定</button>'
                    +'<button type="button" class="layui-btn layui-btn-primary cancel-layer">取消</button>'
                    +'</div>'
                    +'</div>'
                    +'</form>'
                    +'</div>'

                layerIndex = layer.open({
                    type: 1
                    ,title: title //不显示标题栏
                    ,area: '400px;'
                    ,shade: 0.8
                    ,id: 'LAY_layuipro2' //设定一个id，防止重复弹出
                    // ,btn: ['确定', '取消']
                    // ,btnAlign: 'c'
                    ,moveType: 1 //拖拽模式，0或者1
                    ,content: html
                    ,success:function(layero,index){
                        //日期时间选择器
                        laydate.render({
                            elem: '#startTime'
                            ,type: 'datetime'
                            ,trigger: 'click'
                        });

                        //日期时间选择器
                        laydate.render({
                            elem: '#endTime'
                            ,type: 'datetime'
                            ,trigger: 'click'
                        });

                        //日期时间选择器
                        laydate.render({
                            elem: '#checkTime'
                            ,type: 'datetime'
                            ,trigger: 'click'
                        });
                        form.render();

                        $('#confirm').data('num',num);
                    }
                    ,end:function(){
                        form.val('example',{
                            'checkTime':'',
                            'endTime':''
                        })
                    }
                });
            }
        })
    }
</script>
</body>
</html>